<%@ page language="java" contentType="text/html"  pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<link rel="stylesheet" href="${CSS}bootstrap.min.css" />
	<link rel="stylesheet" href="${CSS}font-awesome.min.css"/>	
	<link rel="stylesheet" href="${CSS}ace.min.css" />
	<link rel="stylesheet" href="${APP}statics/tag/css/kalendae.css" />
	<link rel="stylesheet" href="${CSS}edittag.css" />
	<!--[if !IE]> -->
	<script src="${JS}jquery-2.1.4.min.js"></script>
	<!-- <![endif]-->	
	<!--[if IE]>
	<script src="${JS}jquery-1.11.3.min.js"></script>
	<![endif]-->	
	<script src="${JS}edittag.js"></script>
	<script src="${JS}bootstrap.min.js"></script>
	<script src="${JS}ace-elements.min.js"></script>
	<script src="${JS}ace.min.js"></script>
	<script src="${JS}showtag.js"></script>
	<script src="${APP}statics/tag/js/kalendae.js"></script>
</head>
<body style="background:#fff;">
<p style="padding-left:15px;">更多文档<a target="_blank" href="http://www.bootcss.com/p/bootstrap-datetimepicker/">点击这里</a>查看</p>
<form name="Editform">
<div class="form-group">
	<label class="control-label" type="text">日期格式：</label>
	<div class="controls">
		<select class="form-control input-medium" name="format">
			<option value="yyyy">yyyy</option>
			<option value="yyyy-MM">yyyy-MM</option>
			<option value="yyyy-MM-dd" selected>yyyy-MM-dd</option>
			<option value="yyyy-mm-dd hh">yyyy-mm-dd hh</option>	
			<option value="yyyy-mm-dd hh:ii">yyyy-mm-dd hh:ii</option>																
			<option value="yyyy-mm-dd hh:ii:ss">yyyy-mm-dd hh:ii:ss</option>
			<option value="hh">hh</option>
			<option value="hh:ii">hh:ii</option>
			<option value="hh:ii:ss">hh:ii:ss</option>																
		</select>
	</div>
</div>
<div class="form-group">
	<label class="control-label" type="text">开始时间：</label>
	<div class="controls">
		<input type="text" id="calendar0" name="startDate" />
	</div>
</div>
<div class="form-group">
	<label class="control-label" type="text">结束时间：</label>
	<div class="controls">
		<input type="text" id="calendar1" name="endDate" />
	</div>
</div>
<div class="form-group">
	<label class="control-label" type="text">第(?)周禁止：</label>
	<div class="controls">
		<div class="checkbox">
			<label class="checkbox-inline">
				<input name="daysOfWeekDisabled" type="checkbox" value="1">
				<span class="lbl">
					一
				</span>
			</label>
			<label class="checkbox-inline">
				<input name="daysOfWeekDisabled" type="checkbox" value="2">
				<span class="lbl">
					二
				</span>
			</label>
			<label class="checkbox-inline">
				<input name="daysOfWeekDisabled" type="checkbox" value="3">
				<span class="lbl">
					三
				</span>
			</label>
			<label class="checkbox-inline">
				<input name="daysOfWeekDisabled" type="checkbox" value="4">
				<span class="lbl">
					四
				</span>
			</label>
			<label class="checkbox-inline">
				<input name="daysOfWeekDisabled" type="checkbox" value="5">
				<span class="lbl">
					五
				</span>
			</label>
			<label class="checkbox-inline">
				<input name="daysOfWeekDisabled" type="checkbox" checked value="6">
				<span class="lbl">
					六
				</span>
			</label>
			<label class="checkbox-inline">
				<input name="daysOfWeekDisabled" type="checkbox" checked value="0">
				<span class="lbl">
					日
				</span>
			</label>
		</div>
	</div>
</div>
<div class="form-group">
	<label class="control-label" type="text">日期界面：</label>
	<div class="controls">
		<select class="form-control input-medium" name="startView">
			<option value="0">按分钟</option>
			<option value="1">按小时</option>	
			<option value="2" selected>按日期</option>
			<option value="3">按月份</option>
			<option value="4">按年份</option>													
		</select>
	</div>
</div>
</form>
<div class="form-group">
	<label class="control-label" type="text"></label>
	<div class="controls">
		 <button class="btn btn-sm btn-primary btn-block" onclick="saveEdit();">保存效果</button>
	</div>
</div>
<script type="text/javascript">
	var mode="single" 
	new Kalendae.Input('calendar0', {
		mode:mode
	});
	new Kalendae.Input('calendar1', {
		mode:mode
	});
	function saveEdit(){	
	    var modalElement=getEditHtml();
	    var m=modalElement.children().find("input");
	    var format=$("select[name=format]").val();	
	    m.attr("format",format);
	    var startDate=$("input[name=startDate]").val();	
	    if(startDate!=""){
	    	 m.attr("startDate",startDate);
	    }
	    var endDate=$("input[name=endDate]").val();	
	    if(endDate!=""){
	    	 m.attr("endDate",endDate);
	    }
	    var daysOfWeekDisabled=[];
	    $("input[name=daysOfWeekDisabled]:checked").each(function(){
	    	daysOfWeekDisabled.push($(this).val());
	    });
	    m.attr("daysOfWeekDisabled",daysOfWeekDisabled.join(","));
	    var startView=$("select[name=startView]").val();	
	    m.attr("startView",startView);
	    getEditWindow().$('.timepicker').datetimepicker('remove');
	    getEditWindow().form.init("myform");
	}	
</script>
</body>
</html>
